LAPORAN TUGAS MATA KULIAH

METODOLOGI DESAIN PERANGKAT LUNAK PRAKTIK

Dosen : Irma Handayani, S.Kom., M.Cs.

Studi Kasus

“ PERANCANGAN APLIKASI MENGGAMBAR ONLINE BERBASIS WEB

MENGGUNAKAN METODE RAPID APPLICATION DEVELOPMENT ”

Oleh :

5200411122 Gressensia Olivia Neno Aumenu

5200411144 Bella Primin

5200411202 Berliana 'Isyatin Rodhiyah

5200411226 Ade Lia Saputri

5200411236 Lili Christi

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS TEKNOLOGI YOGYAKARTA

BAB I

PENDAHULUAN

1.1 Latar Belakang

Menggambar adalah salah satu cara untuk mengekspresikan perasaan melalui goresan pena.

Untuk mengekspresikan diri, biasanya anak kecil akan suka mencoret-coret kertas.

Dikarenakan kebiasaan mencoret itu, banyak kertas yang terbuang dan tidak bisa dipakai lagi.

Apalagi penggunaan kertas dalam kehidupan semakin bertambah. Banyaknya konsumsi kertas

tentu saja dapat mempengaruhi tingkat penebangan pohon.

Selain kertas, banyak pula benda benda yang rusak, juga banyak dinding yang kotor akibat

coretan para anak kecil. Kerusakan yang ditimbulkan akan membutuhkan lebih banyak budget

untuk memperbaikinya. Selanjutnya, penggunaan pensil, pensil warna, krayon, ataupun cat,

belum terlalu perlu hanya untuk bermain anak-anak, karna akan menambah budget yang

dibutukan untuk itu.

Berawal dari adanya keluhan para orangtua kepada Perusahaan BimBel Bumi dengan sistem

menggambar yang manual karena banyak media serta bahan yang harus dikumpulkan, untuk

itu kami melakukan sebuah pembuatan rancangan aplikasi menggambar berbasis web untuk

Bimbingan Belajar Bumi. Dengan mendaftarkan anaknya menggunakan aplikasi ini, para guru

juga dapat memantau perkembangan seni para murid.

Dalam aplikasi menggambar online ini dapat membantu meminimalisir penggunaan kertas

sebagai media serta dapat mengurangi budget yang akan dikeluarkan untuk anak-anak

menggambar. Selain itu, aplikasi ini akan membantu anak-anak untuk belajar menggambar.

Hal ini sangat mempermudah proses menggambar dalam media dan bidang yang ada.

Sistem ini akan mengolah data user, data admin dan data gambar dengan menggunakan

MySQL. Sistem ini dibangun dengan menggunakan bahasa pemrograman PHP, HTML,

JavaScript, dan CSS. Hasil dari penelitian ini sistem dapat membantu proses penggambaran

dengan adanya system yang efisien dan lebih fleksibel.

1.2 Rumusan Masalah

Mengenai rumusan masalah yang akan dibahas, berdasarkan konteks masalah yang diuraikan

di atas, khususnya yaitu:

a. Bagaimana cara membuat aplikasi menggambar berbasis web.

b. Bagaimana merancang dan membangun aplikasi menggambar yang mudah digunakan untuk

anak-anak.

1.3 Batasan Masalah

Berdasarkan dari identifikasi masalah tersebut, kami membatasi masalah hanya pada:

a. Pengguna aplikasi adalah para guru dan murid di Bimbingan Belajar Bumi.

b. Pendaftaran user dilakukan oleh admin, yang selaku guru dari user.

c. Alat menggambar yang digunakan hanya berupa garis dan warna.

d. Tampilan menggambar berupa kanvas, volume garis, dan pilihan warna.

e. Gambar dapat disimpan, diubah, dan dihapus.

1.4 Tujuan Penelitian

Tujuan dilakukanya penelitian ini yaitu:

a) Menghasilkan sebuah aplikasi menggambar untuk anak-anak.

b) Menghasilkan aplikasi menggambar yang dapat dengan mudah digunakan.

1.5 Manfaat Penelitian

Berikut adalah manfaat dari dilakukanya penelitian ini adalah :

a) Mempermudah anak-anak untuk dapat menggambar dan mewarnai.

b) Mengurangi penggunaan kertas

c) Mengurangi penggunaan budget untuk menggambar.

BAB II

LANDASAN TEORI

2.1 Definisi Menggambar

Secara umum pengertian menggambar adalah kegiatan menorehkan pensil ataupun

pewarna di atas media kertas. Sedangkan pengertian secara khusus, menggambar adalah

kegiatan-kegiatan membentuk imaji, dengan menggunakan banyak pilihan teknik dan alat

dengan membuat tanda-tanda tertentu di atas permukaan media dengan mengolah goresan dari

alat gambar. Gambar merupakan karya seni rupa dua dimensi yang berfungsi untuk untuk

menerangkan ataupun menjelaskan sesuatu.

2.2 Sistem Menggambar

Menggambar adalah kegiatan membentuk citra dengan menggunakan banyak pilihan

teknik dan alat. Dengan membuat tanda-tanda tertentu di atas permukaan dan mengolah

goresan dari alat gambar. Kebanyakan karya menggambar adalah representasi dari ingatan atau

imajinasi seorang juru gambar.

2.3 HTML

HTML adalah bahasa standar pemrogaman yang digunakan untuk membuat halaman

website, yang diakses melalui internet. Singkatan dari "Hypertext Markup Language" atau

"bahasa markup". HTML disusun berdasar kode dan simbol tertentu, yang dimasukkan dalam

sebuah file atau dokumen. Sehingga bisa ditampilkan pada layar komputer. Dan bisa dipahami

oleh para pengguna internet.

Memahami setiap kata yang terkandung, hypertext sendiri dimaksudkan sebagai metode

yang digunakan untuk berpindah laman web ke laman lain. Usai mengklik tulisan atau simbol

yang muncul di halaman website.

Lalu istilah markup, diartikan sebagai suatu hal yang dilakukan tag HTML terhadap teks

didalamnya. Contoh jika mengetik suatu teks dengan tanda tag . Maka teks tersebut akan

muncul dengan huruf tebal atau bold di laman website.

2.4 CSS

CSS adalah kepanjangaan dari Cascading Style Sheets yang berguna untuk

menyederhanakan proses pembuatan website dengan mengatur elemen yang tertulis di bahasa

markup.CSS dipakai untuk mendesain halaman depan atau tampilan website. CSS menangani

tampilan dan ‘rasa’ dari halaman website.

Ada banyak hal yang dapat Anda lakukan menggunakan CSS dibandingkan dengan

bahasa pemrograman inti seperti HTML dan PHP. Ketika menggunakan CSS, Anda dapat

mengatur warna teks, jenis font, baris antar paragraf, ukuran kolom, dan jenis background yang

dipakai.Tidak hanya itu CSS juga bisa untuk mendesain layout, variasi tampilan di berbagai

perangkat yang berbeda, dan berbagai efek yang dipakai di dalam website.

CSS sangat mudah dipelajari, tapi juga powerful karena dapat mengontrol penyajian

tampilan dari dokumen HTML. Mulai dari yang simpel sampai kompleks. Tidak heran jika saat

ini CSS hampir dipakai di berbagai website untuk dikombinasikan dengan HTML maupun

PHP.

2.5 JAVASCRIPT

JavaScript adalah bahasa pemograman populer yang digunakan untuk membuat situs

dengan konten website yang dinamis. Konten dinamis artinya konten dapat bergerak atau

berubah di depan layar tanpa perlu mereload halaman. Misalnya saja, fitur slideshow foto,

gambar animasi, pengisian poling, dan lainnya.

JavaScript sendiri sebenarnya biasanya dikolaborasikan dengan HTML dan CSS. Di

mana HTML digunakan untuk membuat struktur website dan CSS untuk merancang style

halaman website. Lalu, JavaScript berperan menambahkan elemen interaktif untuk

meningkatkan engagement pengguna.

2.6 Data Flow Diagram

DFD adalah suatu diagram yang menggambarkan aliran data dari sebuah proses yang

sering disebut dengan sistem informasi. Di dalam data flow diagram juga menyediakan

informasi mengenai input dan output dari tiap entitas dan proses itu sendiri.

Dalam diagram alir data juga tidak mempunyai kontrol terhadap flow -nya, sehingga

tidak adanya aturan terkait keputusan atau pengulangan. Bentuk penggambaran berupa

data flowchart dengan skema yang lebih spesifik. Menurut Kenneth Kozar, tujuan dari adanya

DFD sendiri adalah sebagai penyedia atau menjembatani antara pengguna dengan sistem.

Data flow diagram berbeda dengan UML (Unified Modelling Language), dimana hal

mendasar yang menjadi pembeda antara kedua skema tersebut terletak

pada flow dan objective penyampaian informasi di dalamnya.

2.7 Eternity Relationship Diagram (ERD)

ERD adalah pemodelan data atau sistem dalam database yang sudah sering digunakan

oleh banyak lembaga. Fungsinya ERD adalah untuk memodelkan struktur dan hubungan antar

data yang relatif kompleks. Keberadaan sistem ERD sangat penting untuk perusahaan dalam

mengelola data yang dimilikinya.Bentuknya seperti diagram yang menjelaskan hubungan antar

objek data.

Bentuknya seperti diagram yang menjelaskan hubungan antar objek data. Untuk

menggambarkannya dibutuhkan:

 Notasi ialah seperangkat lambang yang menggambarkan data

 Simbol sebagai lambang sebagai penanda

 Bagan merupakan rancangan atau skema untuk mempermudah penafsiran dan lain

sebagainya.

2.8 Metode Rapid Application Development

Metode pengembangan perangkat lunak RAD (Rapid Application Development) adalah

sebuah proses pengembangan perangkat lunak yang menekankan siklus pengembangan dengan

waktu yang singkat. Definisi lain menyatakan bahwa metode pengembangan perangkat lunak

RAD adalah metode yang menggunakan pendekatan beorientasi objek untuk pengembangan

sistem yang meliputi pengembangan perangkat dan perangkat lunak.

Rapid application development adalah metode yang berfokus pada pengembangan

aplikasi secara cepat, melalui pengulangan dan feedback berulang-ulang. RAD diajukan oleh

IBM pada tahun 1980 sampai 1990-an, ketika permintaan terhadap aplikasi semakin

meningkat.

Proses atau Tahapan yang berada di dalam metode RAD dibagi menjadi 4 tahapan yaitu

Perencanaan Kebutuhan, Mendesain Sistem, Proses pengembangan & pengumpulan feedback

dan Implementasi atau penyelesaian produk. Proses-proses tersebut dapat dilihat pada gambar

berikut.

a. Perencanaan Kebutuhan.

Tahapan ini merupakan tahap awal dalam suatu pengembangan sistem, dimana

pada tahap ini dilakukan identifikasi masalah dan pengumpulan data yang diperoleh

dari pengguna atau stakeholder pengguna yang bertujuan untuk mengidentifikasi

maksud akhir atau tujuan dari sistem dan kebutuhan informasi yang diinginkan. Pada

tahap ini keterlibatan kedua belah sangatlah penting dalam mengidentifikasi kebutuhan

untuk pengembangan suatu sistem.

b. Desain Sistem.

Di dalam tahap desain sistem, keaktifan pengguna yang terlibat sangatlah penting

untuk mencapai tujuan karena pada tahapan ini dilakukan proses desain dan proses

perbaikan desain secara berulang-ulang apabila masih terdapat ketidaksesuaian desain

terhadap kebutuhan pengguna yang telah diidentifikasi pada tahapan sebelumnya.

Luaran dari tahapan ini adalah spesifikasi software yang meliputi organisasi di dalam

sistem secara umum, struktur data, dan lain-lain.

c. Proses pengembangan dan pengumpulan feedback.

Pada tahap ini desain sistem yang telah dibuat dan disepakati, diubah ke dalam

bentuk aplikasi versi beta sampai dengan versi final. Pada tahapan ini juga programmer

harus terus-menerus melakukan kegiatan pengembangan dan integerasi dengan bagian-

bagian lainnya sambal terus mempertimbangkan feedback dari pengguna atau klien.

Jika proses berjalan lancar maka dapat berlanjut ke tahapan berikutnya, sedangkan jika

aplikasi yang dikembangkan belum menjawab kebutuhan, programmer akan kembali

ke tahapan desain sistem.

d. Implementasi atau penyelesaian produk.

Tahapan ini merupakan tahapan dimana programmer menerapkan desain dari

suatu sistem yang telah disetujui pada tahapan sebelumnya. Sebelum sistem diterapkan,

terlebih dahulu dilakukan proses pengujian terhadap program untuk mendeteksi

kesalahan yang ada pada sistem yang dikembangkan. Pada tahap ini biasa memberikan

tanggapan akan sistem yang sudah dibuat dan mendapat persetujuan mengenai sistem

tersebut.

BAB III

ANALISIS DAN PERENCANAAN SISTEM

3.1 ANALISIS SISTEM

Penelitian ini diharapkan dapat menghasilkan sebuah aplikasi menggambar yang dapat

digunakan untuk semua kalangan, terutama anak-anak, dengan mudah dan efektif.

Kebutuhan sistem ialah sebagai berikut :

a. Aplikasi ini berbasis web yang akan digunakan pada browser.

b. Aplikasi akan terkoneksi ke server database melalui koneksi internet dari perangkat user.

3.2 METODE PENELITIAN

Teknik pengumpulan data yang digunakan dalam penelitian ini, sebagai berikut:

a. Observasi

Observasi merupakan teknik mendapatkan data primer dengan cara mengamati

langsung onyek datanya (Jogiyanto, 2008). Pada penelitian ini, observasi dilakukan

secara online untuk mengamati proses user menggambar dan hasil penggambaran user.

b. Wawancara

Wawancara adalah komunikasi dua arah untuk mendapatkan data daru responden

(Jogiyanto, 2008). Wawancara dilakukan untuk mengkonfirmasi data atau fakta yang

diperoleh pada saat observasi serta sekaligus untuk menggali software requirement dari

user. Wawancara dilakukan kepada user yang terlibat dalam proses menggambar

online.

c. Studi Pustaka

Studi pustaka dilakukan untuk mengumpulkan data dan informasi melalui

dokumen-dokumen baik dalam bentuk buku, jurnal, prosiding, laporan-laporan, atau

bentuk-bentuk lain dalam bentuk tercetak maupun digital. Studi pustaka akan semakin

kredibel apabila didukung oleh foto-foto atau karya tulis akademik dan seni yang telah

ada.

3.3 METODE PENGEMBANGAN SISTEM

Dalam penelitian ini menganalisa dan memaparkan bagaimana konsep penerapan metode

RAD dalam pengembangan aplikasi menggambar berbasis web. Kami merancang aplikasi

dengan melakukan beberapa penelitian dengan menerapakan metode RAD dalam

mengembangkan sistem aplikasi menggambar berbasis web yang kami buat.

a. Perencanaan Kebutuhan

Dalam tahap ini kami mengidentifikasi tujuan-tujuan aplikasi atau sistem

serta mengidentifikasi kebutuhan informasi apa saja yang dibutuhkan dan juga

masalah-masalah apa saja yang ditimbulkan dari tujuan-tujuan tersebut.

Perencanaan yang akan dibuat kedalam sistem, yaitu :

 Mengidentifikasi tujuan perancangan sistem aplikasi menggambar berbasis

web.

 Mengidentifikasi kebutuhan perancangan aplikasi menggambar berbasis

web.

 Mengidentifikasi definisi masalah, mengumpulkan informasi sebanyak-

banyaknya dari berbagai pihak.

b. Desain Sistem

Tahap ini adalah untuk merancang sebuah sistem pemasaran yang

memanfaatkan website untuk mengembangkan usaha dan memperbaiki hal-hal apa

saja yang dapat dilakukan dalam pelaksanaan tahapan desain sistem. Adapun

metode desain yang digunakan terdiri dari beberapa tahapan yaitu :

 Diagram Jenjang, menggambarkan bagaimana sistem aplikasi menggambar

berbasis web. Dengan adanya diagram ini, alur proses dari sistem akan lebih

teratur dan jelas.

 Diagram Konteks. Pada tahap ini dijelaskan penggambaran asal data dan

menunjukkan aliran dari data tersebut.

 Data Flow Diagram. Pada diagram ini, digambarkan seluruh kegiatan yang

terdapat pada sistem secara jelas.

 Entity Relation Diagram. Pada diagram ini dijelaskan rancangan database

yang menggambarkan relasi antar entitas dan atributnya.

c. Implementasi atau Penyelesaian Produk

Setelah melakukan analisis sistem dan perancangan sistem secara rinci, maka

tiba saatnya sistem untuk diimplementasikan. Pada tahap ini, terdapat banyak

aktivitas yang dilakukan, antara lain :

 Membangun Sistem

Dalam tahap ini sistem aplikasi dirancang dengan menggunakan bahasa

pemrograman PHP dan database MySql.

 Menguji Sistem

Pada tahap ini dilakukan proses pengujian atau testing terhadap sistem pada

aplikasi menggambar berbasis web dan melakukan pengenalan terhadap

sistem. Dalam hal ini, sistem di uji agar dapat dijalankan dalam bentuk

aplikasi.

 Tindak lanjut implementasi

Dalam tahapan ini, perlu dilakukan pengetesan penerimaan sistem dengan

menggunakan data yang sesungguhnya. Tahapan ini akan berpengaruh pada

sistem aplikasi menggambar berbasis web yang merupakan sebuah sistem

baru, agar dapat dengan mudah diterima atau perlu adanya perbaikan

kembali.

3.4 PERANCANGAN SISTEM

Perancangan system aplikasi menggambar berbasis web ini menggunakan DFD (Data

Flow Diagram) yang merupakan salah satu teknik pemodelan desain sistem berbasis web.

Pemodelan ini menjadi bagian penting dalam pengembangan sistem karena menjadi satu

satunya cara untuk memvisualisasikan desain sistem dan memeriksa apakah sudah memenuhi

standar yang diinginkan sebelum memulai coding. Beberapa jenis Diagram yang dibuat antara

lain yaitu Diagram koneks, DFD dan ERD.

a. Diagram Jenjang

Diagram Jenjang merupakan desain dan teknik dokumentasi dalam siklus

pengembangan system. Dengan tujuan dapat memberikan informasi berupa diagram tang

terstruktur menampilkan semua proses dalam system.

b. Diagram Level 0 (Diagram Konteks)

Diagram konteks atau level 0 merupakan diagram dengan tingkatan paling rendah, dimana

menggambarkan sistem berinteraksi dengan entitas eksternal. Pada diagram konteks akan

diberi nomor untuk setiap proses yang berjalan, dimulai dari angka 0 terlebih dahulu.

c. Diagram Level 1

DFD level 1 merupakan lanjutan dari diagram konteks, dimana setiap proses yang berjalan

akan diperinci pada tingkatan ini. Sehingga, proses utama akan dipecah menjadi sub – sub

proses yang lebih kecil lagi.

d. Diagram level 2

DFD level 2 merupakan tingkat lanjutan dari level yang sebelumnya, dimana pada fase ini

akan dijelaskan lebih detail terkait tiap prosesnya.

DFD Level 2 Master Data

DFD Level 2 Proses Menggambar

e. ERD

ERD (Entity Relationship Diagram) atau diagram hubungan entitas adalah diagram yang

digunakan untuk perancangan suatu database dan menunjukan relasi antar objek atau entitas

beserta atribut-atributnya secara detail.

3.5 PERANCANGAN DATABASE

3.5.1 Database Aplikasi

3.5.2 Database Data User

3.6 DESAIN INTERFACE

3.7.1 Landing Page

3.7.2 Halaman Login

3.7.3 Halaman Daftar

3.7.4 Home3.7.5 Halaman Menggambar

3.7.6 Daftar Gambar User

3.7.7 Hapus Daftar Gambar User

3.7.8 Daftar Nama User pada Admin

3.7.9 Daftar Gambar User pada Admin

3.7.10 Daftar Gambar User yang sudah dihapus oleh Admin

BAB IV

IMPLEMENTASI DAN PENGUJIAN

4.1 Implementasi

4.1.1 Landing Page dan Source Code

Landing page pada halaman browser akan menampilkan halaman pertama atau disebut juga

Home. Terdapat tombol Login untuk masuk ke halaman Login.

<html>

<head>

<title>aplikasi Drawpen</title>

<style>

h1{

color: aliceblue;

text-align: center;

font-size: 160px;

text-indent: 200px;

}

h2{

color: aliceblue;

text-align: center;

font-size: 30px;

text-indent: 400px;

}

.login1{

color: rgb(255, 255, 255);

text-align:end;

margin-left:1200px;

font-size: 50px;

}

body{

background-image:url("gambar.jpg");

background-repeat: no-repeat;

background-size: cover;

}

</style>

</head>

<body >

<br>

<a class="login1" href="login.php">LOGIN</a>

<br>

<h1>Drawing</h1>

<h2>Easy Online to Draw and Painting</h2>

</body>

</html>

4.1.2 Halaman Login dan Source Code

Sebelum masuk ke halaman mengambar, pengguna diminta untuk melakukan login

dengan mengisikan email or username dan password. Jika ingin mendaftar lebih dulu,

admin dapat menekan tombol Daftar.

<body >

<h1>Drawing</h1>

<br>

<td>

<table class="tabel" align="center" style="border-radius: 15px; background-color:

rgb(75, 159, 233);" cellspacing="15">

<td colspan="2" align="center" style="color: #2412b0"> <h3>LOGIN</h3></td>

</tr>

<tr>

<td>e-mail or username:</td>

<td>:

<input name="e-mail" id="NPM" type="text" placeholder="masukkan e-mail"

maxlength="10" required>

</td>

</tr>

<tr>

<td>Password</td>

<td>:

<input name="Password" id="Password" type="password"

placeholder="masukkan Password ">

</td>

</tr>

<tr>

<td><a href="home_admin.php">LOGIN ADMIN</a></td>

<td><a href="home.html">LOGIN</a></td>

<td><a href="daftar.html">DAFTAR</a></td>

</tr>

</table>

</td>

<td>

</td>

</tr>

<td>

<br>

<h6>Easy Online to Draw and Painting</h6>

</body>

</head>

</html>

4.1.3 Halaman Daftar dan Source Code

Sebelum user dapat menggunakan aplikasi, admin harus melakukan pendaftaran untuk

calon user dengan mengisikan e-mail, username, dan password seperti pada gambar di

bawah ini:

<body >

<h1>Drawing</h1>

<br>

<td>

<table class="tabel" align="center" style="border-radius: 15px; background-color:

rgb(75, 159, 233);" cellspacing="15">

<td colspan="2" align="center" style="color: #2412b0"> <h3>DAFTAR</h3></td>

</tr>

<tr>

<td>:

<input name="email" id="email" type="text" placeholder="masukkan e-

mail">

</td>

</tr>

<tr>

<td>username:</td>

<td>:

<input name="username" id="username" type="text" placeholder="masukkan

username">

</td>

</tr>

<tr>

<td>Password</td>

<td>:

<input name="password" id="password" type="password"

placeholder="masukkan Password ">

</td>

</tr>

<tr>

</tr>

</table></form>

</td>

<td>

</td>

</tr>

<td>

<br>

<h6>Easy Online to Draw and Painting</h6>

</body>

</head>

</html>

4.1.4 Halaman Utama Admin dan Sorce Code

Tampilan Home terdiri dari:

1. Buat gambar

2. Daftar gambar user

3. Daftar user

Berikut adalah tampilan halaman utama admin pada aplikasi menggambar:

<body>

<tr>

<td><h1>Drawpen</h1></td>

</tr>

<tr>

<td><a href="drawing/index.html" type="button" class="a1 btn btn-lg

button12">BUAT GAMBAR</a></td>

</tr>

<tr>

<td><a href="daftar_gambar_user_admin.php" type="button" class="btn btn-lg

button12">DAFTAR GAMBAR USER</a></td>

</tr>

<tr>

<td><a href="daftar_user_admin.php" type="button" class="btn btn-lg

button12">DAFTAR USER</a></td>

</tr>

<tr>

<td><h6>Easy Online to Draw and Painting</h6></td>

</tr>

</table>

</body>

</html>

4.1.5 Halaman Utama User

Tampilan Home terdiri dari:

4. Buat gambar

5. Daftar gambar

Berikut adalah tampilan halaman utama admin pada aplikasi menggambar:

<body>

<tr>

<td><h1>Drawpen</h1></td>

</tr>

<tr>

<td><a href="drawing/index.html" type="button" class="a1 btn btn-lg

button12">BUAT GAMBAR</a></td>

</tr>

<tr>

<td><a href="daftar_gambar_user.php" type="button" class="btn btn-lg

button12">DAFTAR GAMBAR</a></td>

</tr>

<tr>

<td><h6>Easy Online to Draw and Painting</h6></td>

</tr>

</table>

</body>

</html>

4.1.6 Halaman Menggambar dan Source Code

Pada halaman ini user sudah dapat menggambar dengan mengekspresikan semua idenya

dengan bebas.

Fitur yang ada pada halaman ini yaitu:

a. Memberi nama gambar

b. Mengganti warna pena

c. Mengubah size pena

d. Menghapus coretan

e. Ulangi gambar

f. Simpan gambar

<body>

<div id="header">Aplikasi Menggambar</div>

</div>

</div>

</div>

<form action="back_index.php" enctype="multipart/form-data" method="post"

id="form">

<h2>Nama Gambar<input class="putt" type="text" name="nama_gambar"></h2>

</div>

<span id="erase" class="button simp">Hapus</span>

</div>

<a href="../daftar_gambar_user.php"><input type="submit" value="SIMPAN"

id="save" class="button paddd"></input></a>

</div></form>

<span id="reset" class="button simp">Ulangi</span>

</div>

<script

src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

ui.min.js"></script>

</script>

</body>

</html>

4.1.7 Daftar Gambar dan Source Code

Pada daftar gambar user dapat melihat nama gambar yang sudah di buat. User juga dapat

menghapus gambar seperti pada gambar dibawah. Setelah itu, user dapat Log Out pada

halam ini untuk ke halaman Landing Page.

<body>

</div>

</div>

</div>

</header>

<h1 class="display-4 font-italic">DAFTAR GAMBAR USER</h1>

</div>

<tbody>

<?php

$data = mysqli_query($dahkonek,"select * from daftar_gambar");

while($d = mysqli_fetch_array($data)){

?>

<tr>

<td><a href="hapus_gambar_user.php?id_gambar=<?php echo

$d['id_gambar'];?>" class="btn btn-primary btn-lg circle-btn">HAPUS </a></td>

</tr>

<?php

}

?>

</tbody>

</table>

</div>

<h1 class="top-mr">DRAWPEN</H1>

</div>

<a href="dashboard.html" type="button" class="btn btn-lg circle-btn logout-

btn">LOGOUT</a>

</div>

<p>Easy Online to Draw and Painting</p>

</div>

</div>

</body>

4.2 Pengujian

Pada pengujian pembangunan aplikasi menggambar berbasis web, dapat disimpulkan

sebagai berikut:

4.2.1 Landing Page

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

Admin

Menekan tombol Login

Masuk ke halaman login

Sukses

User

Menekan tombol Login

Masuk ke halaman login

Sukses

4.2.2 Halaman Login

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

Admin

Admin memasukkan email dan

password

Admin masuk ke halaman

utama

Sukses

User

User memasukkan username dan

password

User masuk ke halaman utama

Sukses

4.2.3 Halaman Daftar

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

Admin

Admin memasukkan email,

username dan password user

Admin menambahkan data ke

database

Sukses

4.2.4 Halaman Utama Admin

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

Admin

Menekan tombol Daftar Gambar

User

Admin masuk ke halaman

daftar gambar

Sukses

Menekan tombol Buat Gambar

User masuk ke halaman

menggambar

Sukses

Menekan tombol Daftar User

User masuk ke halaman daftar

gambar

Sukses

4.2.5 Halaman Utama User

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

User

Menekan tombol Buat Gambar

User masuk ke halaman

menggambar

Sukses

Menekan tombol Daftar Gambar

User masuk ke halaman daftar

gambar

Sukses

4.2.6 Halaman Menggambar

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

User & Admin

Menambahkan nama gambar

User dapat menambahkan

nama gambar

Sukses

Mengganti warna pena

User dapat mengubah warna

pena

Sukses

Mengganti size garis pena

User dapat mengubah size

garis pena

Sukses

Menyoret bagian kanvas

User dapat menggambar pada

kanvas

Sukses

Menekan tombol hapus

User dapat menghapus coretan

gambar

Sukses

Menekan tombol simpan

User dapat menyimpan

gambar yang dibuat

Gagal

Masuk ke halaman daftar

gambar

Sukses

Menekan tombol ulangi

Gambar dapat di reset dan

diulangi

Sukses

4.2.7 Halaman daftar gambar

Aktor

Skenario Pengujian

Hasil Pengujian

Validasi

Tampilan Daftar Gambar

Aplikasi menunjukkan nama

gambar yang pernah disimpan

Sukses

User

User menekan tombol hapus

Gambar terhapus

Sukses

User menekan tombol Log out

User kembali ke halaman

utama

Sukses

BAB V

KESIMPULAN

Berdasarkan analisis yang sudah dibuat menggunakan perbandingan literature review

dari beberapa jurnal, didapatkan bahwa metode RAD didalam beberapa kriteria memang lebih

unggul daripada metode pengembangan perangkat lunak lainnya dikarenakan metode RAD

sangat efektif diimplementasi pada pengembangan perangkat lunak pada suatu industri atau

organisasi digital yang relatif cepat, tidak memakan banyak waktu, dan tidak banyak

terintegrasi atau tidak terlalu kompleks.

Metode RAD pada dasarnya mengutamakan kecepatan dan fleksibilitas dalam proyek

pengembangan perangkat lunak, selain itu metode RAD juga mengutamakan fungsionalitas

yang didalamnya sudah terdapat hasil dari pengujian fungsionalitas yang mengakibatkan

kualitas perangkat lunak dari segi fungsionalitas sudah terjamin. Anggota dalam tim pun tidak

terlalu banyak, akan tetapi tetap mengikuti role yang sudah ada pada metode RAD dan client

menjadi lebih bisa aktif memberikan feedback atau umpan balik mengenai fungsionalitas dari

perangkat lunak yang akan dikembangkan. Sebelum menggunakan metode RAD, sebaiknya

disesuaikan terlebih dahulu untuk kebutuhan, ruang lingkup pengerjaan, dan waktu

pengembangan perangkat lunak tersebut.